<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>

  <!-- 
    h5内 内置有 获取当前经纬度的API
    
   -->

  <script>

    //  1 能力检测 看一下当前的浏览器是否支持 h5的定位功能
    //  2 navigator 导航器 => 存放着一些信息(设备和浏览器的信息)
    //  3 getCurrentPosition 函数来获取 当前的地理位置信息 异步 
    //    获取的代码 最终是要在不同的浏览器中实现 
    //    当在调用该函数的时候 浏览器会发送一个请求（看不到）=> 浏览器厂商的服务器中 =>才会返回当前的地理地址
    //  4 getCurrentPosition 会接收两个参数（函数）
    //    1 第一个参数就是成功的回调
    //    2 第二个参数就是失败的回调
    //    3 配置信息（可以忽略） 选择是否要以高精度的方式来返回你的地理位置
    // 5 在国内测试该代码的时候  1 火狐容易成功 2 谷歌 和 其他的容易失败 
    if (window.navigator.geolocation) {
      // 支持h5的定位
      window.navigator.geolocation.getCurrentPosition((res)=>{
        console.log("成功了");
        console.log(res);
      },(err)=>{
        console.log("失败");
        console.error(err);
      })
    } else {
      console.error("你的浏览器不支持h5的定位")
    }

  </script>

</body>

</html>